<template>
	<div id="homeShow">
		<div class="head">
			首页
		</div>
		<div class="info">
			<div class="li">
				<div class="title">
					<img src="../../../assets/img/rit.png">
					<div class="text">
						消息通知
					</div>
				</div>
				<div class="cont">
					<div class="informationLi"  v-for="item,index in infoArr.informationList">
						<div>
							<div class="icon"></div>
						</div>
						<div class="text">
							{{item}}
						</div>
					</div>
				</div>
			</div>
			<div class="li">
				<div class="title">
					<img src="../../../assets/img/rit.png">
					<div class="text">
						待办事项
					</div>
				</div>
				<div class="cont">
					<div class="informationLi" :class="(index==2)?'Animation':''" v-for="item,index in infoArr.To_doList">
						<div>
							<div class="icon"></div>
						</div>
						<div class="text">
							<div>{{item}}</div><span>审核</span>
						</div>
					</div>
				</div>
			</div>
		</div>
		<div class="imgTable">
			<div class="title">
				<img src="../../../assets/img/rit.png">
				<div class="text">
					待办事项
				</div>
			</div>
			<div class="cont">

				<div class="li">
					<imgTable :data="[99,110,25,180,190]" :col="['#08bdcd','#066797','#04365a']"
						:x="['飞机','坦克','大炮','机枪','航母']" :tit="'装备实力'" :navShow="true" :nav="option.navList1"></imgTable>
				</div>
				<div class="li">
					<imgTable :data="[99,110,25,180,190]" :col="['#08bdcd','#066797','#04365a']"
						:x="['飞机','坦克','大炮','机枪','航母']" :tit="'弹药实力'" :nav="option.navList1"></imgTable>
				</div>
				<div class="li">
					<imgTable tit='机械实力' :data="[48,70,99,32]" barW="30%" :col="['#3db27a','#1a6455','#4a9737']"
						:x="['汽车','坦克','大炮','航母']" :tit="'机械实力'" :nav="option.navList3"></imgTable>
				</div>
			</div>
		</div>
	</div>
</template>

<script setup>
	import imgTable from '../../../components/table.vue'
	import { ref,reactive,onMounted } from 'vue';
	onMounted(()=>{

	})
	let option= reactive({
		navList1: [
			{ti: '弹药总类',dat: 120}, 
			{ti: '弹药品质',dat: '优'},
			],
		navList3:[
			{ti:'编制',dat:'120'},
			{ti:'实有',dat:'100'},
			{ti:'完好',dat:'20'},
			{ti:'在修',dat:'2'},
			{ti:'实好率',dat:'90%'}
		],
	})

	let infoArr=reactive({
		informationList:['关于最新调拨审核流程变更的通知','军[202212008] 通用管理系统上线试运行通知',
		'关于最近疫情贫困人员往来的管理暂行规定','关于最新调拨审核流程变更的通知',
		'军[202212008] 通用管理系统上线试运行通知','关于最近疫情贫困人员往来的管理暂行规定'],
		To_doList:['仓库 20221012张三维修计划单','仓库 陈林[202212008] xxxx场站设备调拨单',
		'后勤 李广20221012005宇森维修厂资金结算']
	})
</script>

<style lang="less" scoped="scoped">
	@import './index.less';
</style>
